html {
	height: 100%;
}


.background-icon {
	text-align: center;
}

.backgroundImg {
	color: #808080;
	margin-bottom: 1rem;
}

.backgroundFont {
	color: #7b7979;
	font-size: 16px;
	font-family: cursive;
}
.background-icon {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
}
.mui-card-header span {
    float: left;
    margin-right: 1em;
    min-width: 4em;
    color: #999;
    text-align: justify;
    text-align-last: justify;
    font-size: 12px;
}
.mui-card{
    height: 6.5rem;
}
.status1 span.Card_status {
    color: #75b7ff;
    font-weight: bold;
}
.status1.mui-card {
    border-right: 4px solid #75b7ff;
}
.status2 span.Card_status {
    color: #f7bc70;
    font-weight: bold;
}
.status2.mui-card {
    border-right: 4px solid #f7bc70;
}
.status3 span.Card_status {
    color: #f7bc70;
    font-weight: bold;
}
.status3.mui-card {
    border-right: 4px solid #f7bc70;
}
.status4 span.Card_status {
    color: #50ca9e;
    font-weight: bold;
}
.status4.mui-card {
    border-right: 4px solid #50ca9e;
}
.status5 span.Card_status {
    font-weight: bold;
}
.status5.mui-card {
    border-right: 4px solid #999;
}
.mui-card-content{
    height: 2.5rem;
    margin: 0.3rem;
}
.mui-card-footer {
    height: 1.5rem;
    margin-bottom: 6px;
}
.mui-card-footer .mui-btn, button, input[type=button], input[type=reset], input[type=submit] {
    padding: 4px 8px;
    font-size: 12px;
}
.productName {
    font-size: 15px;
    font-weight: bold;
    font-family: initial;
    color: #4a4444;
    padding-top: 0.2rem;
    padding-bottom: 0.3rem;
}
.pruductDate{
    font-size: 13px
}
.cardLeft img{
    width: 100%;
    height: auto;
    padding-left: 0.5rem;
}
.cardRight{
    width: 77%;
    height: auto;
}
.cardLeft{
    width: 23%;
    height: auto;
}